  //点击搜索
  $('.header .container .center button').on('click', function () {
      location.href='./search.html'
  })

  /*选项卡
       1. 设置点击样式
       2. .清除样式
        3.点击事件设置样式*/
  let liEle = $('.nav .container ul>li')

  function onTab() {
      for (let i = 0; i < liEle.length; i++) {
          liEle[i].onclick = function () {
              clear() //清除样式
              this.classList.add('active')
          }
      }
  }
  onTab()

  function clear() {
      for (let i = 0; i < liEle.length; i++) {
          liEle[i].classList.remove('active')
      }

  }
  //sweiper 轮播
  var mySwiper = new Swiper('.swiper', {
      loop: true, // 循环模式选项
      autoplay: true, //自动轮播

      // 如果需要分页器
      pagination: {
          el: '.swiper-pagination',
          clickable: true,
      },

      // 如果需要前进后退按钮
      navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev',
      },
  })

  //获取轮播数据
  $.ajax({
      url: "https://xiongmaoyouxuan.com/api/tab/1?start=0",
      type: 'get',
      success: function (res) {

          banner(res.data.gridsV2)
          banner2(res.data.gridsV2)
      },
      error: function (error) {
          console.log(error)
      }
  })
  //获取列表数据
  function onProductList(page) {
      let start = page * 20
      $.ajax({
          url: "https://xiongmaoyouxuan.com/api/tab/1/feeds?start=" + start,
          type: 'get',
          success: function (res) {
              show(res.data.list)
              console.log(res)
          },
          error: function (error) {
              console.log(error)
          }
      })
  }



  // 动态渲染 轮播区
  function banner(productList) {
      let productStr2 = productList.map(function (item) {
          console.log(item)
          if (item.id == 403) {
              return ` 
                       <div class="left">
                        <p>${item.title}</p>
                        <p>${item.text}</p>
                        <button>Go</button>
                       </div>
                       <div class="r">
                           <img src="${item.imageUrl}" alt="" width="70px" height="90px">
                       </div>
                    `
          }
      }).join('')
      $('.cool').html(productStr2)
  }

  function banner2(productList) {
      let productStr2 = productList.map(function (item) {
          console.log(item)
          if (item.id == 402) {
              return ` 
                       <div class="left">
                        <p>${item.title}</p>
                        <p>${item.text}</p>
                        <button>Go</button>
                       </div>
                       <div class="r">
                           <img src="${item.imageUrl}" alt="" width="70px" height="90px">
                       </div>
                    `
          }
      }).join('')
      $('.coupons').html(productStr2)
  }


  //动态喧嚷列表
  let strMore = '' //全局的列表字符串

  function show(productList) {
      let productListStr = productList.map(function (item) {
          return `<div class="show" onclick=onDetail(${item.id})>
                            <img src="${item.image}"
                               width="280px" height="390px" alt="">
                            <div>${item.title}</div>
                            <div class="platform"><span>天猫</span> <span>包邮</span></div>
                            <div class='price'><span>￥${item.price}</span><span>${item.saleNum}人已买</span> <span>${item.couponValue}</span></div>

                        </div>`
      }).join('')
      strMore = strMore + productListStr
      $('.list .container').html(strMore)
  }

  //跳转到详情页
  function onDetail(id) {

      location.href = 'details.html?id=' + id
  }

  //加载更多
  function more() {
      let page = 1 //页号
      onProductList(page)

      $('.btn').click(function () {
          onProductList(++page)
      })
  }
  more()

  //回到顶部
  $('.back button').click(function () {

      let timer = setInterval(function () {
          document.documentElement.scrollTop = document.documentElement.scrollTop - 100
          if (document.documentElement.scrollTop <= 0) {
              clearInterval(timer)
          }
      }, 50)
  })

  //跳转到 9.9包邮


  function onPage() {
      location.href = './9.9page.html'
  }